<?=view('header.html')?>

<body class="layui-view-body">
    <div class="layui-content">
        <div class="layui-row">

            <div class="layui-card">
                <div class="layui-card-header">
                    导航链接管理
                </div>
                <div class="layui-card-body">
                    <input type="hidden" id="tid" value="<?=$tid?>">

                    <table id="listTable" lay-filter="listTable"></table>
                    <script type="text/html" id="toolbarOption">
                        <a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchDel">删除</a>
                        <a class="layui-btn layui-btn-sm" lay-event="add">添加</a>
                    </script>

                    <script type="text/html" id="showTpl">
                        <input type="checkbox" name="show" value="{{d.show}}" lay-skin="switch" lay-text="显示|隐藏" lay-filter="showSwitch" {{ d.show == 1 ? 'checked' : '' }}>
                    </script>

                    <script type="text/html" id="barOption">
                        <a class="layui-btn layui-btn-xs layui-btn-default" lay-event="show">访问</a>
                        <a class="layui-btn layui-btn-xs layui-btn-warm" lay-event="edit">编辑</a>
                        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
                    </script>
                </div>
            </div>
        </div>
    </div>
    <?=view('footer.html')?>
    <script type="text/javascript">
        layui.use(['layer', 'table', 'laydate', 'form', 'jquery'], function () {
            var $ = layui.jquery,
                form = layui.form,
                layer = layui.layer,
                table = layui.table,
                laydate = layui.laydate;
            

            /**index**/
            laydate.render({
                elem: '#time_start'
            });
            laydate.render({
                elem: '#time_end'
            });

            //数据初始化
            var tableInit = table.render({
                elem: '#listTable',
                toolbar: "#toolbarOption",
                defaultToolbar: [],
                title: '导航链接列表',
                url: window.location.href,
                method: 'post',
                cols: [[
                    { type: 'checkbox', width: 50 },
                    { field: 'id', title: 'ID', width: 80, unresize: true, sort: true },
                    { field: 'name', title: '名称', width: 150, templet: function (d) { return d.spacer + d.name } },
                    { field: 'enname', title: '英文名称', width: 160 },
                    { field: 'title', title: 'alt标题' },
                    { field: 'url', title: '链接' },
                    { field: 'show', title: '是否显示', templet: '#showTpl', unresize: true },
                    { fixed: 'right', title: '操作', fixed: 'right', toolbar: '#barOption' }
                ]],
                limits: [10, 50, 100, 150, 200, 300],
                page: true,
                response: {
                    statusCode: 0,
                    countName: 'count'
                },
                parseData: function (res) {
                    return {
                        'code': res.code,
                        "data": res.data.data,
                        'count': res.data.total
                    };
                }
            });

            //显示切换操作
            form.on('switch(showSwitch)', function (obj) {
                var id = obj.othis.parents('tr').find("td:eq(1)").find(".layui-table-cell").text();
                var title = '';
                var val = '';
                if (this.value == 1) {
                    title = '[隐藏]此链接吗?';
                    val = 0;
                } else {
                    title = '[显示]此链接吗?';
                    val = 1;
                }

                //点确认再切换
                var x = obj.elem.checked;
                obj.elem.checked = !x;
                form.render('checkbox');

                layer.confirm(title, function (index) {
                    $.post(adminpath + "admin/navbar/switchShow", { id: id, value: val }, function (res) {
                        if (res.code == 0) {
                            layer.msg('操作成功', { icon: 1, time: 1500 });
                        } else {
                            layer.msg(res.msg, { icon: 5, anim: 6 });
                        }
                        tableInit.reload();
                    }, 'json');
                    layer.close(index);
                });
            });

            //监听状态操作
            form.on('switch(statusSwitch)', function (obj) {
                var id = obj.othis.parents('tr').find("td:eq(1)").find(".layui-table-cell").text();
                var title = '';
                var val = '';

                //点确认再切换
                var x = obj.elem.checked;
                obj.elem.checked = !x;
                form.render('checkbox');

                if (this.value == 1) {
                    layer.msg('已经阅读过了', { icon: 5, anim: 6 });
                    return '';
                    title = '您确定要[禁用]它吗?';
                    val = 0;
                } else {
                    title = '设为已阅读?';
                    val = 1;
                }

                layer.confirm(title, function (index) {
                    $.post(adminpath + "admin/navbar/switchStatus", { id: id, value: val }, function (res) {
                        if (res.code == 0) {
                            layer.msg('操作成功', { icon: 1, time: 1500 });
                        } else {
                            layer.msg(res.msg, { icon: 5, anim: 6 });
                        }
                        tableInit.reload();
                    }, 'json');
                    layer.close(index);
                });
            });

            //头工具栏事件
            table.on('toolbar(listTable)', function (obj) {
                var checkStatus = table.checkStatus(obj.config.id);
                var data = checkStatus.data;
                var ids = [];
                var tid = $("#tid").val();
                $.each(data, function (i, v) {
                    ids.push(v.id);
                });

                switch (obj.event) {
                    case 'add':
                        layer.open({
                            type: 2,
                            area: ['600px', '80%'],
                            title: '添加导航链接',
                            content: [adminpath + 'admin/navbar/add?tid=' + tid]
                        });
                        break;

                    case 'batchDel':
                        layer.confirm('确定要删除这些？', function (index) {
                            $.post(adminpath + "admin/navbar/del", { ids: ids }, function (res) {
                                if (res.code == 0) {
                                    layer.msg(res.msg, { icon: 1, time: 1500 });
                                } else {
                                    layer.msg(res.msg, { icon: 5, anim: 6 });
                                }
                                tableInit.reload();
                            }, 'json');
                            layer.close(index);
                        });
                        break;
                };
            });

            //监听行操作
            table.on('tool(listTable)', function (obj) {
                var data = obj.data;
                var id = data.id

                switch (obj.event) {

                    case 'edit':
                        layer.open({
                            type: 2,
                            area: ['600px', '80%'],
                            title: '编辑导航链接',
                            content: [adminpath + 'admin/navbar/edit?tid=' + tid + '&id=' + id]
                        });
                        break;

                    case 'show':
                        var url = data.url;
                        if (url == 'undefined' || !url || url == '') {
                            url = '/';
                        }
                        window.open(url);
                        // layer.open({
                        //     type: 2,
                        //     area: ['600px', '80%'],
                        //     title: '查看',
                        //     content: [adminpath + 'admin/navbar/show?id=' + id]
                        // });
                        break;

                    case 'del':
                        layer.confirm('确定要删除吗？', function (index) {
                            $.post(adminpath + "admin/navbar/del", { ids: id }, function (res) {
                                if (res.code == 0) {
                                    obj.del();
                                    layer.msg(res.msg, { icon: 1, time: 1500 });
                                } else {
                                    layer.msg(res.msg, { icon: 5, anim: 6 });
                                }
                                tableInit.reload();
                            }, 'json');
                            layer.close(index);
                        });

                        break;
                }
            });

            //搜索条件
            form.on('submit(ams_reset)', function (data) {
                $("#searchForm")[0].reset();
                form.render();
                $('#ams_search').trigger('click');
            });

            //标题搜索
            form.on('submit(ams_search)', function (data) {
                tableInit.reload({
                    where: data.field
                    , page: {
                        curr: 1
                    }
                });
            });

        });
    </script>
</body>

</html>
